<template>

	<view class="" style="background: #7C4FFF;min-height: 100vh;">
		<u-navbar :custom-back="gotabpolice"  background='transparent' :border-bottom='false' title=" " immersive>

		</u-navbar>
		
		<image :src="$ftpUrl('/in_friends.png')" style="width: 750rpx;height: 720rpx;"></image>
	
	
	    <view style="width: 700rpx;margin:20rpx auto;border-radius: 10rpx;background: #fff;" class="u-padding-40 u-text-center">
			<image :src="$ftpUrl('/vip_title.png')" style="width: 440rpx;height: 58rpx;"></image>
			<view class="u-font-weight u-margin-top-40">邀请3位好友即可获得 20元优惠券</view>
			
			
			<view class="u-flex u-row-around u-margin-top-40 u-margin-bottom-40" >
				<view v-for="(item,inde) in list" :key="index" style="position: relative;text-align: center;">
					<image :src="item.headimg" style="width: 98rpx;height: 98rpx;border-radius: 100%;"></image>
					<view class="u-margin-top-20">{{item.nickname}}</view>
					<button v-if="item.isShare" open-type="share" class="custom-btn"></button>
				</view>
			</view>
			
			<button open-type="share" style="
			background: linear-gradient(180deg,#4f8bff , #745eff );
			border-radius: 58px;
			height:80rpx;
			line-height: 80rpx;
			font-size: 26rpx;
			box-shadow: 0px 6px 12px 0px rgba(2,88,255,0.28);margin-top: 20rpx;text-align: center;color: #fff;margin-top: 40rpx;">
			立即邀请
			</button>
			
		</view>
	
	
		<u-popup v-model="show" mode='center' border-radius="14" >
				<view style="background: #4F8BFF;height:800rpx;border-radius: 20rpx;">
					<image :src="$ftpUrl('/in_friends.png')" style="width: 680rpx;"></image>
					<view style="text-align: center;color: #fff;margin: 20rpx 0;">恭喜你获得20优惠券</view>
					<view style="background: #fff; width:90%;border-radius: 10rpx;margin: auto;">
						<coupond :list='list'  @selectConpound='selectConpound'></coupond>
					</view>
					
				</view>
				
				<button open-type="share"
				 
				 @click=""
				 style="
				background: linear-gradient(180deg,#4f8bff , #745eff );
				border-radius: 58px;
				height:80rpx;
				line-height: 80rpx;
				font-size: 26rpx;
				box-shadow: 0px 6px 12px 0px rgba(2,88,255,0.28);margin-top: 20rpx;text-align: center;color: #fff;margin-top: 40rpx;">
				立即领取
				</button>
		</u-popup>
	
	</view>
</template>

<script>
	import coupond from '@/pages/scan/components/coupond';
	export default{
		components:{
			coupond
		},
		data(){
			return{
				list:[{
					endStr: "永久有效",
					money: "10.00"
				}],
				show:false
			}
		},
		
		onLoad() {
			this.getInvite()
		},
		
		methods:{
			gotabpolice(e){
				uni.navigateBack({
					success(res) {
						
					},fail(err) {
						uni.switchTab({
							url:'/pages/index/index'
						})
					}
				})
			},
			selectConpound(e){
				
			},
			getInvite(){
				this.$u.post('/user/team',{
					page:1,
					limit:3
				}).then(res=>{
				    this.list=res;
					if(res.length>=3){
						this.show=true
					}
					for(var i=0;i<4-res.length;i++){
						this.list.push({
							headimg:'/static/in_add.png',
							nickname:'待邀请',
							isShare:true
						})
					}
				})
			}
		}
	}
</script>

<style>
</style>
